Das animerte SVG – mit CSS Transitions und JavaScript

Challenges

Was du versuchen kannst:

• Füge weitere Elemente (rect, text) ein und transformiere/animiere sie.
• Im Stylesheet gelten für alle children des SVG die gleichen Transition-Eigenschaften. Wenn du dich sicher fühlst, kannst du für verschiedene Elemente verschiedene Timings definieren.

Tipps

• Um verschiedene Elemente zu Unterscheiden, kannst du id und class verwenden
• Um in CSS die id zu referenzieren braucht es eine Raute: #my-id.
• Um in CSS die class zu referenzieren braucht es einen Punkt .my-class.